import {createReplyBottomAtt, imgZoom,createAttachLi} from '../../util/communicationUtil';
import {WeaLocaleProvider} from 'ecCom';
import { toJS } from 'mobx';
const getLabel = WeaLocaleProvider.getLabel;

class QuoteItem extends React.Component {
  constructor(props) {
    super(props);
  }
  componentDidMount() {
    let dom = ReactDOM.findDOMNode(this);
    imgZoom(dom, ".wea-cl-content");
  }
  componentDidUpdate(prevProps, prevState) {
    let dom = ReactDOM.findDOMNode(this);
    imgZoom(dom, ".wea-cl-content");
  }
  setPanelHidden = () => {
    const { clearReplyInfo, valueChange, store: {resetReplyParam} } = this.props;
    this.quotePanel.style.display = 'none';
    clearReplyInfo();
    resetReplyParam();
  }
 
  contentUtil = (str) => {
    const { store: {setReplyMark}, signReplyInfo: { signReplyData }} = this.props;
    let savestr = "";
    let pic = `[${getLabel(528760 , '图片')}]`;
    setReplyMark(str);
    str = str.replace(/<\/p>|<p>/g,'');
    str = str.replace(/<img.*?>/g, pic);
    str = str.replace(/<[^>]*>|<\/[^>]*>/gm, "")
    str = `<div class='remark-quote'>${str}</div>`;
    return str;
  }
 
  render() {
    const { signReplyInfo = {}, isFromLoglist = false} = this.props;
    const { signReplyFlag = false, signReplyStr = '', signReplyData = {} } = signReplyInfo;
    return (
      <div>
        <div className='quote-item-warp'>
          {signReplyFlag && <div className={'needWrap'}>
            <div className={'quote-top-words'} ref={ref => this.quotePanel = ref }>
                {
                  !isFromLoglist && <div className={'quote-btn-cancel'} onClick={this.setPanelHidden}>
                    <i class="anticon anticon-cross" title="删除" 
                      style={{position: 'absolute', right: '20px', top: '20px', cursor: 'pointer', color: 'rgb(51, 51, 51)'}}
                      onClick={this.setPanelHidden}>
                    </i>
                  </div>
                }
                <div className={'top-panel'}>
                  <div className={'content-top-quote'}> 
                    <span className={'wfComu-reply-user'}>
                      <span className='quote-span'>{getLabel(385534, '回复')}</span>
                      <a href={`javaScript:openhrm(${signReplyData.displayid});`} onClick={window.pointerXY}>{signReplyData.displayname}</a>
                      <span className={'reply-span'}>{signReplyData.displaydepname}</span>
                      <span className={'reply-span reply-date'}>{signReplyData.log_operatedate}</span>
                      <span className={'reply-span reply-time'}>{signReplyData.log_operatetime}</span>
                      <span className={'reply-span right-words'}>{'[' + signReplyData.log_nodename + '/' + signReplyData.operationname + ']'}</span>
                    </span>
                  </div>
                  
                  <div className={'reply-content'}>
                    <div   className={'wea-cl-content'}  dangerouslySetInnerHTML={{ __html: this.contentUtil(signReplyStr) }}></div>
                  </div>
                </div>    
            </div>
          </div>}
        </div>
    </div> 
    );
  }
}

export default QuoteItem;